import React from 'react';
import { connect } from 'dva';
import _ from 'lodash';
import { Card, Icon, WhiteSpace, Button } from 'antd-mobile';
import { jump } from '../../../utils';
import styles from './index.less';
import InlineList from '../../../components/inline-list';

const { Header, Body } = Card;

/*
 * 病例讨论详情
 * */
function Detail({ dispatch, discuss, patients: { data: pat } }) {
    const jumpPatientDetail = (patient) => (e) => {
        e.preventDefault();
        console.log('id', patient);
        jump(dispatch)({
            pathname: 'home/check/patient',
            state: patient,
        });
    };
    const moreBtn = ({ text, icon, onClick }) => (
        <a
            onClick={onClick}
            className={styles.moreBtn}
        >
            {text}
            <Icon type={icon}/>
        </a>
    );
    const { data, current: { id: cId } } = discuss;

    if (cId) {
        const disc = _.find(data, ['id', cId]);
        const patient = _.find(pat, ['id', disc.patientId]);
        const discussInfo = (
            <div>
                <InlineList
                    align="left"
                    data={disc}
                    normalize={[
                        ['applierName', '申请人'],
                        ['institutionName', '所属机构'],
                        ['departmentName', '所属科室'],
                        ['applyDate', '申请时间'],
                        ['purpose', '目的'],
                    ]}
                />
            </div>
        );
        const patientInfo = (
            <div>
                <InlineList
                    align="left"
                    data={patient}
                    normalize={[
                        ['name', '姓名'],
                        ['gender', '性别', function (gender) {
                            if (gender === '1') {
                                return '男';
                            }
                            return '女';
                        }],
                        ['age', '年龄'],
                        ['bedNumber', '床号'],
                        ['code', '住院号'],
                        ['departmentName', '科室'],
                    ]}
                />
            </div>
        );

        return (
            <div className={styles.normal}>
                <Card>
                    <Header
                        title="申请信息"
                    />
                    <Body>
                        {discussInfo}
                    </Body>
                </Card>
                <WhiteSpace size="lg"/>
                <Card>
                    <Header
                        title="患者信息"
                        extra={moreBtn({
                            text: '详细信息',
                            icon: 'right',
                            onClick: jumpPatientDetail.bind(null, patient)(),
                        })}
                    />
                    <Body>
                        {patientInfo}
                    </Body>
                </Card>
                <WhiteSpace size="lg"/>
                <Button type="primary">开始讨论</Button>
                <WhiteSpace size="sm"/>
                <span
                    style={{
                        color: '#999',
                    }}
                >
                    提示：会议开始前10分钟可以提前进入会场
                </span>

            </div>
        );
    }
    return (<div>z暂无数据</div>);
}
/*
 * 需要引用的model，解构传入mapStateToProps方法，并返回出来；
 * 组建的props中将会获取model数据
 * */
function mapStateToProps({ discuss, patients }) {
    return {
        discuss,
        patients,
    };
}
export default connect(mapStateToProps)(Detail);
